<template>

  <div class="app-container">
    <el-form
      :model="queryParams"
      ref="queryForm"
      size="small"
      :inline="true"
      v-show="showSearch"
      label-width="68px"
    >
      <el-form-item label="单号" prop="FaultNo">
        <el-input
          v-model="queryParams.FaultNo"
          placeholder="请输入编号"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="标题" prop="Title">
        <el-input
          v-model="queryParams.Title"
          placeholder="请输入名称"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item label="序列号" prop="AssetSN">
        <el-input
          v-model="queryParams.AssetSN"
          placeholder="序列号/追溯码/标签码"
          clearable
          @keyup.enter.native="handleQuery"
        />
      </el-form-item>
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="handleQuery"
          >搜索</el-button
        >
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
          >重置</el-button
        >
      </el-form-item>
    </el-form>
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          plain
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['assets:assetsinformation:add']"
          >新增</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          plain
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['assets:assetsinformation:edit']"
          >修改</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          plain
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['assets:assetsinformation:remove']"
          >删除</el-button
        >
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="warning"
          plain
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['assets:assetsinformation:export']"
          >导出</el-button
        >
      </el-col>
      <right-toolbar
        :showSearch.sync="showSearch"
        @queryTable="getList"
      ></right-toolbar>
    </el-row>
    <el-table

        stripe
        v-loading="loading"
        :data="tableData"
        @selection-change="handleSelectionChange"
        style="width: 100%">
        <el-table-column type="selection" width="55" align="center">
        </el-table-column>
        <el-table-column
          prop="FaultNo"
          label="单号"
          sortable
          align="center"
          >
        </el-table-column>
        <el-table-column
          prop="Title"
          label="标题"
          sortable
          align="center"
          >
        </el-table-column>
        <el-table-column
          prop="AssetName"
          label="资产名称"
          sortable
          align="center"
          >
        </el-table-column>
        <el-table-column
          prop="AssetSN"
          sortable
          label="序列号"
          align="center"
          width="150">
        </el-table-column>

        <el-table-column label="状态" sortable width="120" align="center" prop="Status">
          <template slot-scope="scope">
            <dict-tag
              :options="dict.type.warehouse_assets_type"
              :value="scope.row.Status"
            />
          </template>
        </el-table-column>
        <el-table-column label="申报信息" align="center">
          <el-table-column
            prop="CreateUserName"
            label="申报人"
            sortable
            align="center"
            >
          </el-table-column>
          <el-table-column
            prop="CreateDate"
            sortable
            label="申报时间"
            align="center"
            >
          </el-table-column>

        </el-table-column>
        <el-table-column label="派单信息" align="center">
          <el-table-column
            prop="DisUserName"
            label="派单人"
            align="center"
            sortable
            >
          </el-table-column>
          <el-table-column
            prop="DisDate"
            sortable
            label="派单时间"
            align="center"
            >
          </el-table-column>
        </el-table-column>
        <el-table-column
          label="操作"
          align="center"
          class-name="small-padding fixed-width"
        >
          <template slot-scope="scope">
            <el-button
              size="mini"
              type="text"
              icon="el-icon-edit"
              @click="handleUpdate(scope.row)"
              v-hasPermi="['assets:assetsinformation:edit']"
              >修改</el-button
            >
            <el-button
              size="mini"
              type="text"
              icon="el-icon-delete"
              @click="handleDelete(scope.row)"
              v-hasPermi="['assets:assetsinformation:remove']"
              >删除</el-button
            >
          </template>
        </el-table-column>
      </el-table>
      <pagination
        v-show="total > 0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />
      <!-- 添加或修改资产信息对话框 -->
      <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
         <el-form ref="form" :model="form" :rules="rules" label-width="80px">
           <el-form-item label="故障单号" prop="FaultNo">
             <el-input v-model="form.FaultNo" disabled  placeholder="[自动分配]" />
           </el-form-item>
           <el-form-item label="序列号" prop="AssetSN">
             <el-input v-model="form.AssetSN" :disabled='disabled' placeholder="可输入序列号/标签码/追溯码" />
           </el-form-item>
           <el-form-item label="故障标题" prop="Title">
             <el-input v-model="form.Title" :disabled='disabled' placeholder="对故障的概括说明" />
           </el-form-item>
           <el-form-item label="故障说明" prop="Remark">

             <el-input type="textarea" :disabled='disabled' v-model="form.Remark" placeholder="对故障的详细描述" />
           </el-form-item>
           <el-form-item label="商品图" prop="faceImage" v-if="!disabled">
             <image-upload  v-model="form.faceImage" />
           </el-form-item>
           <el-form-item label="商品图" prop="faceImage" v-else>
            <el-image
                  style="width: 100px; height: 100px"
                  src="https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg"
                  fit="fill"></el-image>
           </el-form-item>
         </el-form>
         <div slot="footer" class="dialog-footer">
           <el-button type="primary" @click="submitForm">确 定</el-button>
           <el-button @click="cancel">取 消</el-button>
         </div>
      </el-dialog>
  </div>
</template>

<script>
  export default {
    name: "EquipmentPatrolManagement",
    dicts:[
       "warehouse_assets_type",
    ],
    data() {
      return {
        tableData:[],
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
          FaultNo: null,
          Title: null,
          AssetSN: null,
        },
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 遮罩层
        loading: true,
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        open: false,
        form: {
          FaultNo:null,
          AssetSN:null,
          Title:null,
          Remark:null,
          faceImage:null,
        },
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        // 选中数组
        ids: [],
        //添加
        disabled:false,
         rules: {
            AssetSN: [{ required: true, message: "序列号/追溯码/标签码不能为空", trigger: "blur" }],
            Title: [{ required: true, message: "故障标题不能为空", trigger: "blur" }],

         },
      }
    },
    created() {
      this.getList();
    },
    methods: {
      TestIt(time) {
          //var Dtime = "\/Date(1408943415760+0800)\/";
          var t = time.slice(6, 19)
          //var d = eval('new ' + str.substr(1, str.length - 2));// 这样也可以转换成Date
          var NewDtime = new Date(parseInt(t));
          return this.formatDate(NewDtime);
      },
      formatDate(dt) {
          var year = dt.getFullYear();
          var month = dt.getMonth() + 1;
          var date = dt.getDate();
          var hour = dt.getHours();
          var minute = dt.getMinutes();
          var second = dt.getSeconds();
          return year + "-" + month + "-" + date + " " + hour + ":" + minute + ":" + second;
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        this.ids = selection.map((item) => item.assetsInformationID);
        this.single = selection.length !== 1;
        this.multiple = !selection.length;
      },
      /** 查询资产信息列表 */
      getList() {
        this.tableData=[];
        let a= {
            AssetID: "99a9823152e744debb95f4cd0cdd6afd",
            AssetName: "小米手机5",
            AssetSN: "222",
            CreateDate: "/Date(1584200972577+0800)/",
            CreateUserID: "00000000000000000000000000000000",
            CreateUserName: "超级管理员",
            DisDate: null,
            DisUserID: "",
            DisUserName: "",
            EditDate: "/Date(1584200972577+0800)/",
            EditUserID: "00000000000000000000000000000000",
            EditUserName: "超级管理员",
            FaultNo: "F20031406",
            ID: "0860ecaf19f14ad996518f6dca5c3dc3",
            LabelNo: "",
            RN: 1,
            Remark: "123",
            RepairDate: null,
            SIMNo: "",
            SNID: 63,
            SNStatus: 0,
            Status: 0,
            SuyuanCode: "2003140010000001",
            Title: "123",
            Type: 0,
          }
          a.CreateDate=this.TestIt(a.CreateDate)
          let b=[]
          for(let i=0;i<this.queryParams.pageSize;i++)
          {

           
            // b.push(a)
            this.tableData.push(
            a
            )

            //this.tableData.push(b)
          }
          //console.log(b)

        this.loading = false;
         this.total = this.tableData.length;
        console.log(this.queryParams)



        // this.loading = true;
        // listAssetsinformation(this.queryParams).then((response) => {
        //   this.assetsinformationList = response.rows;
        //   this.total = response.total;
        //   this.loading = false;
        // });

      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },

      /** 重置按钮操作 */
      resetQuery() {
        // this.$refs["queryForm"].resetFields();
        this.resetForm("queryForm");
        this.handleQuery();
      },


      /** 新增按钮操作 */
      handleAdd() {
        this.disabled=false;
        this.reset();
        console.log(this.form)
        this.open = true;
        this.title = "添加资产信息";
      },


      /** 修改按钮操作 */
      handleUpdate(row) {
        this.disabled=true;
        console.log(row)
        this.reset();
        const assetsInformationID = row.assetsInformationID || this.ids;
        this.form=row;
        this.open = true;
      //   getAssetsinformation(assetsInformationID).then((response) => {

      //     this.form = response.data;
      //     // console.log(typeof this.form.aextFun.split(","));
      //     // console.log(typeof this.form.aextFun);
      //     console.log(this.form.aextFun);
      //     if(this.form.aextFun==null){
      //       this.form.aextFun=[];
      //     }else{
      //       this.form.aextFun = (this.form.aextFun || "").split(",");
      //     }
      //     this.open = true;
      //     this.title = "修改资产信息";
      //   });
      },
      /** 删除按钮操作 */
      handleDelete(row) {
        const assetsInformationIDs = row.assetsInformationID || this.ids;
        this.$modal.confirm(
            '是否确认删除资产信息编号为"' + assetsInformationIDs + '"的数据项？'
          )
          .then(function () {
           // return delAssetsinformation(assetsInformationIDs);
          })
          .then(() => {
            // this.getList();
             this.$modal.msgSuccess("删除成功");
          })
          .catch(() => {});
      },
      /** 导出按钮操作 */
      handleExport() {
        this.download(
          "assets/assetsinformation/export",
          {
            ...this.queryParams,
          },
          `assetsinformation_${new Date().getTime()}.xlsx`
        );
      },
      /** 提交按钮 */
      submitForm() {
         console.log(this.form);
        this.$refs["form"].validate((valid) => {
          if (valid) {
           // this.form.aextFun = this.form.aextFun.join(",");

            // if (this.form.assetsInformationID != null) {
            //   updateAssetsinformation(this.form).then((response) => {
            //     this.$modal.msgSuccess("修改成功");
            //     this.open = false;
            //     this.getList();
            //   });
            // } else {
            //   addAssetsinformation(this.form).then((response) => {
            //     this.$modal.msgSuccess("新增成功");
            //     this.open = false;
            //     this.getList();
            //   });
            // }
          }
        });
      },
      // 取消按钮
      cancel() {
        this.open = false;
        this.reset();
      },
      // 表单重置
      reset() {
        //this.$refs["form"].resetFields();
        this.form= {
          FaultNo:null,
          AssetSN:null,
          Title:null,
          Remark:null,
          faceImage:null,
        }

      },
    }
  }
</script>

<style>

</style>
